$(function(){
  let $url=$('input[type="text"]'),
      $btnSave=$('input[type="button"]'),
      $img=$('img'),
      $tmpImg=$('<img>');

  loadImage();
  $btnSave.click(()=>{
    $tmpImg.attr('crossOrigin','anonymous');

    $tmpImg.attr('src',$url.val());
  })

  $tmpImg.load(function(){
    let can=$('<canvas>').get(0);
    let ctx=can.getContext('2d');

    ctx.width=this.width;
    ctx.height=this.height;

    ctx.drawImage(this,0,0,can.width,can.height);
    window.localStorage.setItem('img',can.toDataURL());
    loadImage();
  })

  function loadImage(){
    let strImg=window.localStorage.getItem('img');
    if(strImg){
      $img.attr('src',strImg);
      $img.css({display:'block'});
    }else{
      strImg="";
      $img.css({display:'none'});
    }
  }

});
